<template>
    <ElForm class="shop-item" label-width="100px" label-position="left">
        <div class="shop-item-header">
            <div class="shop-item-title">
                <div style="font-size: 18px;font-weight: bold;">{{ data.dpmc }}</div>
            </div>
            <div>
                <ElButton type="primary" v-if="auth.has('edit')" link @click="$emit('edit')">编辑</ElButton>
            </div>
        </div>

        <ElRow>
            <ElCol :span="6">
                <ElFormItem label="店铺平台">{{ data.dpptName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="店铺类目">{{ data.dplmName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="难易等级">{{ data.nydjName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="所属城市">{{ data.sscs }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="剔除退款">{{ data.tctkName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="首次合作时间">{{ data.dpschzsj }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="合作状态">{{ data.dphzztName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="对接渠道">{{ data.djqdName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="客户姓名">{{ data.khxm }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="手机号码">{{ data.sjhm }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="微信">{{ data.wx }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="企业微信">{{ data.qywx }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="钉钉">{{ data.dingding }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="QQ">{{ data.txqq }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="配合度">{{ data.phdName }}</ElFormItem>
            </ElCol>
            <ElCol :span="6">
                <ElFormItem label="业务对接人">{{ data.ywdjrName }}</ElFormItem>
            </ElCol>
            <ElCol :span="24">
                <ElFormItem label="店铺链接">{{ data.dplj }}</ElFormItem>
            </ElCol>
            <ElCol :span="24">
                <ElFormItem label="店铺备注">{{ data.dpbz }}</ElFormItem>
            </ElCol>
        </ElRow>

    </ElForm>
</template>

<script setup lang="ts">
import { ElButton, ElRow, ElCol, ElForm, ElFormItem } from 'element-plus'
import { useAuth } from '@/utils/auth'

const auth = useAuth()

interface Props {
    data: object
}

const props = withDefaults(defineProps<Props>(), {
    data: () => ({})
})

const data = props.data as any

</script>

<style scoped lang="scss">
.shop-item {
    padding-top: 18px;
    margin-bottom: 18px;

    &+& {
        border-top: 1px solid #E1E1E1;
        ;
    }

    &-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    &-title {
        display: flex;
        align-items: center;
        font-family: PingFangSC-Medium;
        font-weight: 1000;
        font-size: 16px;
        color: #333333;
    }

    &-tag {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 22px;
        background: #094DB2;
        border-radius: 2px;
        font-family: PingFangHK-Regular;
        font-weight: 400;
        font-size: 12px;
        color: #FFFFFF;
        text-align: right;
        margin-right: 5px;
    }

    :deep(.el-form-item__label) {
        font-family: PingFangSC-Regular;
        font-weight: 500;
        font-size: 12px;
        color: #666666;
        text-align: right;
    }

    :deep(.el-form-item__content) {
        font-family: PingFangSC-Medium;
        font-weight: 500;
        font-size: 12px;
        color: #333333;
    }
}
</style>
